<template>
  <view class="maxBox">
    <tm-navbar
      :title="props.title"
      class="navClass"
      _class="navInnerView"
      :hideBack="!props.leftShow"
      :fontSize="32"
    >
      <template v-slot:left v-if="props.leftShow"> </template>
      <template v-slot:right v-if="props.rightShow">
        <view @tap="clickRightFunc">
          <slot name="right">
            <view class="rightView">
              <image
                src="@/static/public/arrow.png"
                style="width: 20px; height: 20px"
              />
            </view>
          </slot>
        </view>
      </template>
    </tm-navbar>
  </view>
</template>

<script lang="ts" setup>
import { withDefaults, defineProps, defineEmits } from "vue";
import tmApp from "@/tmui/components/tm-app/tm-app.vue";
import tmNavbar from "@/tmui/components/tm-navbar/tm-navbar.vue";
/**@prop */
const props = withDefaults(defineProps<ComponentProps>(), {
  // 标题  左边箭头  右边箭头|内容  左边点击显示图标和效果  右边点击显示图标和效果
  title: "默认图标",
  leftShow: true,
  leftEffect: function () {
    return;
  },
  rightShow: false,
  rightEffect: function () {
    return;
  },
});
const emits = defineEmits(["click"]);
//你的代码...
interface ComponentProps {
  title: string;
  leftShow?: boolean;
  leftEffect?: () => any;
  rightShow?: boolean;
  rightEffect?: () => any;
}
/**@methods */
/**@description 右侧点击了的效果 */
const clickRightFunc = () => {
  props.rightEffect && props.rightEffect();
  return;
};
</script>

<style scoped lang="scss">
@import "./index.scss";
</style>
